<template>
  <ms-container>

    <ms-aside-container>
      <select-menu
        :data="projects"
        :current-data="currentProject"
        :title="$t('test_track.project')"
        @dataChange="changeProject"/>
      <node-tree
        class="node-tree"
        v-loading="result.loading"
        @nodeSelectEvent="nodeChange"
        @refresh="refresh"
        :tree-nodes="treeNodes"
        :type="'edit'"
        :draggable="nodeTreeDraggable"
        :select-node.sync="selectNode"
        @refreshTable="refreshTable"
        :current-project="currentProject"
        ref="nodeTree"/>
    </ms-aside-container>

    <ms-main-container>
      <test-case-list
        :current-project="currentProject"
        :select-node-ids="selectNodeIds"
        :select-parent-nodes="selectParentNodes"
        @testCaseEdit="editTestCase"
        @testCaseCopy="copyTestCase"
        @testCaseDetail="showTestCaseDetail"
        @batchMove="batchMove"
        @refresh="refresh"
        @moveToNode="moveToNode"
        ref="testCaseList">
      </test-case-list>
    </ms-main-container>

    <test-case-edit
      @refresh="refreshTable"
      :read-only="testCaseReadOnly"
      :tree-nodes="treeNodes"
      :select-node="selectNode"
      :current-project="currentProject"
      ref="testCaseEditDialog">
    </test-case-edit>

    <test-case-move @refresh="refresh" ref="testCaseMove"/>

    <batch-move @refresh="refresh" ref="testBatchMove"/>

  </ms-container>

</template>

<script>

import NodeTree from '../common/NodeTree';
import TestCaseEdit from './components/TestCaseEdit';
import {CURRENT_PROJECT, ROLE_TEST_MANAGER, ROLE_TEST_USER} from '../../../../common/js/constants';
import TestCaseList from "./components/TestCaseList";
import SelectMenu from "../common/SelectMenu";
import TestCaseMove from "./components/TestCaseMove";
import MsContainer from "../../common/components/MsContainer";
import MsAsideContainer from "../../common/components/MsAsideContainer";
import MsMainContainer from "../../common/components/MsMainContainer";
import {checkoutTestManagerOrTestUser, hasRoles} from "../../../../common/js/utils";
import BatchMove from "./components/BatchMove";

export default {
  name: "TestCase",
  components: {
    MsMainContainer,
    MsAsideContainer, MsContainer, TestCaseMove, TestCaseList, NodeTree, TestCaseEdit, SelectMenu, BatchMove
  },
  comments: {},
  data() {
    return {
      result: {},
      currentPage: 1,
      pageSize: 5,
      total: 0,
      projects: [],
      currentProject: null,
      treeNodes: [],
      selectNodeIds: [],
      selectParentNodes: [],
      testCaseReadOnly: true,
      selectNode: {},
      nodeTreeDraggable: true,
    }
  },
  mounted() {
    this.init(this.$route);
  },
  watch: {
    '$route'(to, from) {
      this.init(to);
    },
    currentProject() {
      this.refresh();
    }
  },
  methods: {
    init(route) {
      let path = route.path;
      if (path.indexOf("/track/case/edit") >= 0 || path.indexOf("/track/case/create") >= 0) {
        this.getProjects();
        this.testCaseReadOnly = false;
        if (!checkoutTestManagerOrTestUser()) {
          this.testCaseReadOnly = true;
        }
        let caseId = this.$route.params.caseId;
        this.openRecentTestCaseEditDialog(caseId);
        this.$router.push('/track/case/all');
      } else if (route.params.projectId) {
        this.getProjects();
        this.getProjectById(route.params.projectId);
      }
    },
    getProjects() {
      this.$get("/project/listAll", (response) => {
        this.projects = response.data;
        let lastProject = JSON.parse(localStorage.getItem(CURRENT_PROJECT));
        if (lastProject) {
          let hasCurrentProject = false;
          for (let i = 0; i < this.projects.length; i++) {
            if (this.projects[i].id == lastProject.id) {
              this.currentProject = lastProject;
              hasCurrentProject = true;
              break;
            }
          }
          if (!hasCurrentProject) {
            this.setCurrentProject(this.projects[0]);
          }
        } else {
          if (this.projects.length > 0) {
            this.setCurrentProject(this.projects[0]);
          }
        }
        // this.checkProject();
      });
    },
    checkProject() {
      if (this.currentProject === null) {
        this.$alert(this.$t('test_track.case.no_project'), {
          confirmButtonText: this.$t('project.create'),
          callback: action => {
            this.$router.push("/track/project/create");
          }
        });
      }
    },
    changeProject(project) {
      this.setCurrentProject(project);
    },
    nodeChange(nodeIds, pNodes) {
      this.selectNodeIds = nodeIds;
      this.selectParentNodes = pNodes;
    },
    refreshTable() {
      this.$refs.testCaseList.initTableData();
    },
    editTestCase(testCase) {
      this.testCaseReadOnly = false;
      if (this.treeNodes.length < 1) {
        this.$warning(this.$t('test_track.case.create_module_first'));
        return;
      }
      this.$refs.testCaseEditDialog.open(testCase);
    },
    copyTestCase(testCase) {
      this.testCaseReadOnly = false;
      let item = {};
      Object.assign(item, testCase);
      item.name = '';
      item.isCopy = true;
      this.$refs.testCaseEditDialog.open(item);
    },
    showTestCaseDetail(testCase) {
      this.testCaseReadOnly = true;
      this.$refs.testCaseEditDialog.open(testCase);
    },
    getProjectByCaseId(caseId) {
      return this.$get('/test/case/project/' + caseId, async response => {
        this.setCurrentProject(response.data);
      });
    },
    refresh() {
      this.selectNodeIds = [];
      this.selectParentNodes = [];
      this.selectNode = {};
      this.$refs.testCaseList.initTableData();
      this.getNodeTree();
    },
    openRecentTestCaseEditDialog(caseId) {
      if (caseId) {
        this.getProjectByCaseId(caseId);
        this.$get('/test/case/get/' + caseId, response => {
          if (response.data) {
            this.$refs.testCaseEditDialog.open(response.data);
          }
        });
      } else {
        this.$refs.testCaseEditDialog.open();
      }
    },
    getProjectById(id) {
      if (id && id != 'all') {
        this.$get('/project/get/' + id, response => {
          let project = response.data;
          this.setCurrentProject(project);
          // this.$router.push('/track/case/all');
        });
      }
      if (id === 'all') {
        this.refresh();
      }
    },
    setCurrentProject(project) {
      if (project) {
        this.currentProject = project;
        localStorage.setItem(CURRENT_PROJECT, JSON.stringify(project));
      }
      this.refresh();
    },
    getNodeTree() {
      if (!hasRoles(ROLE_TEST_USER, ROLE_TEST_MANAGER)) {
        this.nodeTreeDraggable = false;
      }
      if (this.currentProject) {
        this.result = this.$get("/case/node/list/" + this.currentProject.id, response => {
          this.treeNodes = response.data;
        });
      }
    },
    moveToNode(selectIds) {
      if (selectIds.size < 1) {
        this.$warning(this.$t('test_track.plan_view.select_manipulate'));
        return;
      }
      this.$refs.testCaseEditDialog.getModuleOptions();
      this.$refs.testCaseMove.open(this.$refs.testCaseEditDialog.moduleOptions, selectIds);
    },
    batchMove(selectIds) {
      this.$refs.testBatchMove.open(this.treeNodes, selectIds, this.$refs.testCaseEditDialog.moduleOptions);
    }
  }
}
</script>

<style scoped>

.el-main {
  padding: 15px;
}

</style>
